import React, { Component } from 'react';
import axios from 'axios'
import Item from './components/Item'
import styles from './Index.module.css'
class Index extends Component {
    constructor(props){
        super(props);
        this.state = {
          musics:[]
        }
      }
    render() {
        const MusicItem=this.state.musics.map(item=>{
            return (
                <Item data={item} key={item.id} ></Item>
            )
        })
        return (
            <div className={styles.content}>
                {MusicItem }
            </div>
        );
    }
    
    componentDidMount(){
        axios.get("http://122.112.161.135:3000/top/playlist?cat=华语").then(res=>{
            // console.log(res.data.playlists);
            this.setState({
                musics:res.data.playlists
            })
        })
        
    }
}

export default Index;
